<template>
  <div class="">
    <el-row>
      <el-col :span="24">
        <div class="page-filter mb10 fl">
          <el-form ref="filter" :model="filter" label-width="0">
            <el-form-item class="mr10 mb5 fl">
              <el-date-picker
                v-model="filter.month"
                placeholder="月份"
                type="month"
                format="yyyy-MM"
                value-format="yyyy-MM"
                size="small"
                clearable
                style="width: 100%"
              />
            </el-form-item>
            <el-form-item class="mr10 mb5 fl" prop="year">
              <el-date-picker
                v-model="filter.year"
                placeholder="年度"
                type="year"
                format="yyyy"
                value-format="yyyy"
                size="small"
                clearable
                style="width: 100%"
              />
            </el-form-item>
            <el-form-item class="mr10 mb5 fl" style="width: 300px">
              <el-button size="small" @click="app.resetFields($refs['filter'].$parent,'filter')">清 空</el-button>
              <el-button type="primary" size="small" @click="getList">查 询</el-button>
            </el-form-item>
          </el-form>
        </div>
      </el-col>
      <el-col :span="24">
        <el-table :summary-method="getSummariesList" show-summary ref="multipleTable" class="search-table" :data="list" border fit highlight-current-row style="width: 100%;">
          <el-table-column label="序号" align="center" width="56px">
            <template slot-scope="{$index}">
              {{ $index + 1 }}
            </template>
          </el-table-column>
          <el-table-column label="客户名称" width="220px" prop="ctm_name" />
          <el-table-column label="开票日期" width="110px" align="center" prop="invoice_time" />
          <el-table-column label="发票号码" width="160px" prop="num" />
          <el-table-column label="货物名称" width="120px" prop="company" />
          <el-table-column label="不含税金额" width="110px" align="right" prop="no_tax" />
          <el-table-column label="税额" width="110px" align="right" prop="tax" />
          <el-table-column label="总金额" width="110px" align="right" prop="has_tax" />
          <el-table-column label="税点" width="110px" align="right" prop="rate" />
          <el-table-column label="备注" min-width="260px" prop="remark" />
          <el-table-column label="附件" align="center" width="90px" fixed="right">
            <template slot-scope="{row}">
              <a style="color: blue" 
                href="javascript:void(0)"
                @click="files({e_id: row.id, type: '',
                                          db_type: 'logc_pro_invoice_archives'})"
              >详情</a>
            </template>
          </el-table-column>
        </el-table>
        <pagination v-show="filter.pageAll>0" :total="filter.pageAll" :page.sync="filter.pageCurrent" :limit.sync="filter.pageNumber" @pagination="getList" />
      </el-col>
    </el-row>
    <el-row class="mt10">
      <el-col :span="24">
        <el-table :summary-method="getSummaries" show-summary :data="years" border fit highlight-current-row style="width: 941px;">
          <el-table-column label="月份" width="140px" align="center" prop="m" />
          <el-table-column label="不含税金额" width="160px" align="right" prop="no_tax" />
          <el-table-column label="税额" width="160px" align="right" prop="tax" />
          <el-table-column label="总金额" width="160px" align="right" prop="has_tax" />
        </el-table>
      </el-col>
    </el-row>
    <Cos ref="cos" :info="dialog" />
  </div>
</template>

<script>
import { inputInvoice } from '@/api/statistics/statistics'
import page from '@/utils/page'

export default {
  name: '',
  components: { },
  extends: page,
  props: {
    reqList: {
      default: inputInvoice,
      type: Function
    }
  },
  data() {
    return {
      years: [],
      yearsSummaries: [],
      listSummaries: {}
    }
  },
  created() {
    this.getList()
  },
  methods: {
    getListBefore() {
      if(!(this.filter.month && this.filter.month != '')) this.$set(this.filter, 'month', new Date().getFullYear() + '-' + (new Date().getMonth() + 1))
      if(!(this.filter.year && this.filter.year != '')) this.$set(this.filter, 'year', new Date().getFullYear()+'')
    },
    getListAfter(e) {
      this.listSummaries = e.info || {}
      this.years = e.years || []
      let no_tax = 0
      let tax = 0
      let has_tax = 0
      this.years.forEach(e => {
        no_tax += e.no_tax || 0
        tax += e.tax || 0
        has_tax += e.has_tax || 0
      })
      this.yearsSummaries[0] = no_tax
      this.yearsSummaries[1] = tax
      this.yearsSummaries[2] = has_tax
    },
    getSummaries() {
      const sums = []
      sums[0] = '合计'
      sums[1] = this.yearsSummaries[0]
      sums[2] = this.yearsSummaries[1]
      sums[3] = this.yearsSummaries[2]
      sums[4] = 0
      sums[5] = 0
      return sums
    },
    getSummariesList() {
      const sums = []
      sums[0] = '合计'
      sums[1] = ''
      sums[2] = ''
      sums[3] = ''
      sums[4] = ''
      sums[5] = this.listSummaries.no_tax || 0
      sums[6] = this.listSummaries.tax || 0
      sums[7] = this.listSummaries.has_tax || 0
      return sums
    }
  }
}
</script>
<style scoped>
</style>
